<!-- 财务人员界面(除) -->
<template>
	<div>
		<el-row style="text-align: left;">
			<el-button type="warning" @click="dialogFormVisible = true">修改</el-button>
		</el-row>
		<el-table :data="tableData" style="width: 100%;">
			<el-table-column type="selection" width="55">
			</el-table-column>
			<el-table-column fixed label="ID" prop="id" sortable width="100"></el-table-column>
			<el-table-column label="员工姓名" prop="name" sortable width="100"></el-table-column>
			<el-table-column label="所属部门" prop="dept" sortable width="100"></el-table-column>
			<el-table-column label="基本工资" prop="basics" sortable width="100"></el-table-column>
			<el-table-column label="绩效奖金" prop="performance" sortable width="100"></el-table-column>
			<el-table-column label="罚款" prop="debit" sortable width="100"></el-table-column>
			<el-table-column label="实际工资" prop="actual" sortable width="100"></el-table-column>
			<el-table-column label="操作时间" prop="time" sortable width="100"></el-table-column>
			<el-table-column label="操作人" prop="pname" sortable width="100"></el-table-column>
		</el-table>
		<el-pagination :current-page="pageInfo.currentPage" :page-size="pageInfo.pageSize" :page-sizes="[3, 5, 10, 50]"
			:total="pageInfo.total" layout="total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange"
			@current-change="handleCurrentChange">
		</el-pagination>
		<el-dialog :visible.sync="dialogFormVisible" title="修改工资">
			<el-form ref="form" :model="form" :rules="formRule">
				<el-form-item :label-width="formLabelWidth" style="text-align: left;" label="员工ID" prop="id">
					<el-select v-model="form.id" placeholder="请选择员工">
						<el-option v-for="(item,index) in tableData1" :key="index" :label="item.attendeeName" :value="item.attendeeId">
							{{item.name}}</el-option>
					</el-select>
				</el-form-item>
				<el-form-item :label-width="formLabelWidth" label="基本工资" prop="base">
					<el-input v-model="form.base" autocomplete="off"></el-input>
				</el-form-item>
				<el-form-item :label-width="formLabelWidth" label="绩效奖金" prop="bonus">
					<el-input v-model="form.bonus"></el-input>
				</el-form-item>
				<el-form-item>
					<el-button @click="dialogFormVisible = false">取 消</el-button>
					<el-button type="primary" @click="send('form')">确 定</el-button>
				</el-form-item>
			</el-form>
		</el-dialog>
	</div>
</template>

<script>
	export default {
		data() {
			var Lbase = (rule, value, callback) => {
				var nu = /^\d{1,}$/;
				if (value === '') {
					callback(new Error('请输入基础工资'));
				} else if (value.length > 8) {
					callback(new Error('工资过高!'));
				} else if (!nu.test(value)) {
					callback(new Error('请输入正确的工资!'));
				} else {
					callback();
				}
			};
			var Lbonus = (rule, value, callback) => {
				var nu = /^\d{1,}$/;
				if (value === '') {
					callback(new Error('请输入绩效奖金'));
				} else if (value.length > 8) {
					callback(new Error('奖金过高!'));
				} else if (!nu.test(value)) {
					callback(new Error('请输入正确的奖金!'));
				} else {
					callback();
				}
			};
			var Lid = (rule, value, callback) => {
				if (value === '') {
					callback(new Error('请选择员工'));
				} else{
				callback();
				}
			};
			return {
				form: {
					id: "",
					base: "",
					bonus: ""
				},
				dialogFormVisible: false,
				formLabelWidth: "70px",
				tableData: [],
				tableData1: [],
				pageInfo: {
					total: 10,
					currentPage: 1,
					pageNum: 1,
					pageSize: 10
				},
				formRule: {
					id: [{
						validator: Lid,
						trigger: 'blur'
					}],
					base: [{
						validator: Lbase,
						trigger: 'blur'
					}],
					bonus: [{
						validator: Lbonus,
						trigger: 'blur'
					}]
				},
			}
		},
		mounted() {
			this.findArtList(1, this.pageInfo.pageSize);
		},
		methods: {
			send(formName) {
				this.$refs[formName].validate((valid) => {
					if (valid) {
						this.$http.post("/finance/revSalary", this.form).then(res => {
							if (res.data.code == "200") {
								this.$message({
									message: '修改成功',
									type: 'success'
								});
								this.dialogFormVisible = false
								this.findArtList(this.pageInfo.pageNum, this.pageInfo.pageSize);
								this.form.id = "";
								this.form.base = "";
								this.form.bonus = "";
							} else {
								this.$message({
									message: '修改失败',
									type: 'error'
								});
							}
						})
					} else {
						this.$message({
							message: '请更改错误',
							type: 'error'
						})
						return false;
					}
				});
			},
			handleEdit(index, row) {
				var rowid = row.id
				var rowstatus = row.status
				this.$http.get("/finance/GZManages", {
					params: {
						rowid,
						rowstatus
					}
				}).then(res => {
					if (res.data != "0") {
						row.status = res.data
					} else {
						this.$message({
							message: '服务器异常',
							type: 'error'
						});
					}
				}).catch((err) => {
					this.$message({
						message: '服务器异常' + err,
						type: 'error'
					});
				});
			},
			findArtList(page, limit) {
				var that = this;
				that.$http.post("/finance/GZManages/" + page + "/" + limit).then(function(res) {
					if (res.data.code != "500") {
						that.tableData = res.data.data;
						that.tableData1 = res.data.dataa;
						console.log(res.data.data)
						that.total = res.data.total;
						that.pageInfo.total = res.data.total;
					}
				})
			},
			handleSizeChange(val) {
				this.pageInfo.pageSize = val;
				this.findArtList(this.pageInfo.pageNum, this.pageInfo.pageSize);
			},
			handleCurrentChange(val) {
				this.pageInfo.pageNum = val;
				this.findArtList(this.pageInfo.pageNum, this.pageInfo.pageSize);
			}
		}
	}
</script>
<style>
	.w {
		text-align: left;
	}
</style>
